/**
 * Created by Administrator on 2017/5/17.
 */

var indexs=1;
$(function(){
    index1();
});
//时间选择
var zytype="0";
var zytime="";
function choicetime(data){
    if(data =="0"){
        zytype="0";
        $("#choiceday").css("display","inline-block");
        $("#choiceday").val("");
        $("#choicemonth").val("");
        zytime ="";
        $("#thisDay").css("background-color","#3366FF");
        $('#thisMonth').css("background-color","");
        $("#choicemonth").css("display","none");
        index1();

    }else if(data =="1"){
        zytype="1";
        $("#choicemonth").css("display","inline-block");
        $("#choiceday").val("");
        $("#choicemonth").val("");
        zytime ="";
        $("#thisMonth").css("background-color","#3366FF");
        $('#thisDay').css("background-color","");
        $("#choiceday").css("display","none");
        index1();
    }
}
//选择时间后 点击查询事件
function query(){
    //获取input框的值
    if(zytype =="0"){
        zytime =$("#choiceday").val();
    }else if(zytype=="1"){
        zytime =$("#choicemonth").val();
    }
   index1();
}

var index1oneInterval;
function index1(){
    clearInterval(index1oneInterval);
    index1one();
    index1oneInterval=setInterval(index1one,60000);
    carFlowChart();
    carfrom();
    carGroupChart();
    ckllCount();
    peopleFlowChart();
    contrastChart();
}

//1分钟定时任务
function index1one() {
    carInOut();
}

function ckllCount() {
    $.get(baseURL + "cll/cllvehiclerecord/cllCount?type="+zytype+"&time="+zytime, function(r){
        var cllCount= r.cllCount;
        $("#cllz").html(cllCount+"车次")
        $("#clln").html(r.southCount+"车次")
        $("#cllb").html(r.northCount+"车次")
    })
    $.get(baseURL + "rll/rlldayinfo/kllCount?type="+zytype+"&time="+zytime, function(r){
        var kllCount= r.kllCount;
        $("#kllz").html(kllCount+"人次")
        $("#klln").html(r.southCount+"人次")
        $("#kllb").html(r.northCount+"人次")

        var area=["南区","北区"];
        var value=[{value:r.southCount,name:"南区"},{value:r.northCount,name:"北区"}];

        var myChart = echarts.init(document.getElementById('peoplecount'));
        var option = {
            tooltip : {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c}"+"人次"+" ({d}%)",
                position: [65, 280]
            },
            legend: {
                x: 'center',
                y: 16,
                data:area,
                textStyle:{
                    color:"#e9ebee"
                }
            },
            series : [
                {
                    name: '客流统计',
                    type: 'pie',
                    radius : '50%',
                    center: ['50%', '60%'],
                    data:value,
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };
        myChart.setOption(option);
        window.addEventListener("resize",function(){
            myChart.resize();
        });
    });
}
//车流量统计
function carFlowChart() {
    var xname=null;
    if(zytype == "0"){
        xname="小时";
    }else if(zytype == "1"){
        xname="日期";
    }
    $.get("../../cll/cllvehiclerecord/carflow?type="+zytype+"&time="+zytime, function (r) {
        /*console.log(1)
        console.log(r)*/
        souinvalue=r.southinlist;
        sououtvalue=r.southoutlist;
        norinvalue=r.northlist;
        noroutvalue=r.northoutlist;
        var myChart = echarts.init($("#carFlowChart")[0]);
        var option = {
            tooltip : {
                trigger: 'axis',
                formatter: function(params) { //自定义函数修改折线图给数据加单位
                    var str = '';//声明一个变量用来存储数据
                    str += '<div>'+ params[0].name +'</div>'; //显示首行的函数
                    for(var i=0; i<params.length; i++) { //图显示的数据较多时需要循环数据，这样才可以成功的给多条数据添加单位
                        str += '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:'+params[i].color+';"></span>'+ params[i].seriesName +'</span> : <span>'+ params[i].data+'车次' +'</br>';
                    }
                    return str;
                }
            },
            legend: {
                x: 'center',
                data: ["南区入口","南区出口","北区入口","北区出口"],
                textStyle:{
                    color:"#e9ebee"
                }
            },
            grid: {
                x: 46,
                y:30,
                x2:32,
                y2:40,
                borderWidth: 0
            },
            calculable : true,
            xAxis : [
                {
                    type : 'category',
                    name:xname,
                    boundaryGap : false,
                    data :r.southinlist[0],
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#a4a7ab'
                        }
                    }
                }
            ],
            yAxis : [
                {
                    type : 'value',
                    name :"总数/车次",
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#a4a7ab'
                        }
                    }

                }
            ],
            series : [
                {
                    name:"南区入口",
                    type:'line',
                    //stack: '辆',
                    data:r.southinlist[1],
                    smooth: true,
                    itemStyle: {
                        normal: {
                            //color:"#45c0ff"
                            color:"red"
                        }
                    }
                },
                {
                    name:"南区出口",
                    type:'line',
                    //stack: '辆',
                    data:r.southoutlist[1],
                    smooth: true,
                    itemStyle: {
                        normal: {
                            color:"#0ad5ff"
                        }
                    }
                },
                {
                    name:"北区入口",
                    type:'line',
                    //stack: '辆',
                    data:r.northlist[1],
                    smooth: true,
                    itemStyle: {
                        normal: {
                            color:"#005ea1"
                        }
                    }
                },
                {
                    name:"北区出口",
                    type:'line',
                    //stack: '辆',
                    data:r.northoutlist[1],
                    smooth: true,
                    itemStyle: {
                        normal: {
                            color:"#ffcb89"
                        }
                    }
                }
            ]
        };
        myChart.setOption(option);
        window.addEventListener("resize",function(){
            myChart.resize();
        });
    })
}
//车辆归属地统计
function carfrom() {
    var areaname=[];
    var areavalue=[];
    $.get("../../cll/cllvehiclerecord/carownership?type="+zytype+"&time="+zytime, function (r) {
        for (var i = 0; i <r.carownership.length ; i++) {
            areaname.push(r.carownership[i].areaname);
            areavalue.push(r.carownership[i].yvalie);
        }
        var myChart = echarts.init($("#carfrom")[0]);
        var option = {
            tooltip : {
                trigger: 'axis',
                formatter: function(params) { //自定义函数修改折线图给数据加单位
                    var str = '';//声明一个变量用来存储数据
                    str += '<div>'+ params[0].name +'</div>'; //显示首行的函数
                    for(var i=0; i<params.length; i++) { //图显示的数据较多时需要循环数据，这样才可以成功的给多条数据添加单位
                        str += '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:'+params[i].color+';"></span>'+ params[i].seriesName +'</span> : <span>'+ params[i].data+'辆' +'</br>';
                    }
                    return str;
                },
                axisPointer : {            // 坐标轴指示器，坐标轴触发有效
                    type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            grid: {
                x: 50,
                y:20,
                x2:22,
                y2:40,
                borderWidth: 0
            },
            calculable : true,
            xAxis : [
                {
                    type : 'category',
                    name:'省份',
                    data:areaname,
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#a4a7ab',
                            align: 'center'
                        }
                    }
                }
            ],
            yAxis : [
                {
                    type : 'value',
                    name:'总数/车次',
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#a4a7ab'
                        }
                    }
                }
            ],
            series : [
                {
                    name:'数量（辆）',
                    type:'bar',
                    /*barWidth:'30',*/
                    data:areavalue,
                    itemStyle: {
                        normal: {
                            label: {
                                show: true, //开启显示
                                position: 'top', //在上方显示
                                textStyle: { //数值样式
                                    color: 'white'
                                    /*fontSize: 16*/
                                }
                            },
                            color:"#1afffd"
                        }
                    }

                }
            ]
        };
        myChart.setOption(option);
        window.addEventListener("resize",function(){
            myChart.resize();
        });
    })
}
function carGroupChart() {
    var clor = ['#1afffd', '#2e7cff', '#ffcb89', '#005ea1', '#0ad5ff','#990099','#FF0000','#009900','#FF00FF','#FFC0CB','#B0C4DE','#C0C0C0','#8B4513','#FFE4B5','#808000','#7CFC00','#40E0D0','#BA55D3','#F0FFFF','#E6E6FA','#5F9EA0'];
    var type=24;
    // var cartype=[];
    var carvalue=[];
    $.get("../../cll/cllvehiclerecord/cartype?type="+zytype+"&time="+zytime, function (r) {
        var list=r.cartypelist;
        for (var i = 0; i <list.length ; i++) {
            //cartype.push(list[i].areaname);
            carvalue.push({
                value:list[i].yvalie,name:list[i].areaname,itemStyle:{
                    normal:{
                        color:clor[i]
                    }
                }
            });
        }
        var myChart = echarts.init($("#carGroupChart")[0]);
        var option = {
            tooltip : {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c}"+"车次"+" ({d}%)",
                position: [70, 280]
            },
            /*legend: {
                x: 'center',
                y:"16",
                data:cartype,
                textStyle:{
                    color:"#e9ebee"
                }
            },*/
            series : [
                {
                    itemStyle: {
                        normal: {
                            label: {
                                show: false
                            },
                            labelLine: {
                                show: false
                            }
                        }
                    },
                    name: '',
                    type: 'pie',
                    radius : '50%',
                    center: ['53%', '60%'],
                    data:carvalue,
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };
        myChart.setOption(option);
        window.addEventListener("resize",function(){
            myChart.resize();
        });
    });
}
//车辆通过列表
function carInOut() {
    $.get("../../cll/cllvehiclerecord/carinout", function (r) {
        $("#carinout").empty();
        //var info="<thead><tr><th style='width: 18%'>车牌号</th><th>车型</th><th>归属地</th><th>时间</th><th>详情</th></tr></thead><tbody>";
        var info="";
        var list=r.carinoutlist;
        for (var i = 0; i <list.length ; i++) {
            if (list[i].monitoringName.indexOf("入口")!=-1){
                info +="<tr class='carIn'><td>"+list[i].plateNo+"</td><td>"+list[i].vehicleType+"</td><td>"+list[i].areaname+"</td><td>"+list[i].monitoringName+"</td><td>"+list[i].crossTime+"</td></tr>";
            }else {
                info +="<tr class='carOut'><td>"+list[i].plateNo+"</td><td>"+list[i].vehicleType+"</td><td>"+list[i].areaname+"</td><td>"+list[i].monitoringName+"</td><td>"+list[i].crossTime+"</td></tr>";
            }
        }
        info +="</tbody>"
        $("#carinout").append(info);
    })
}
//客流量统计
function peopleFlowChart() {
    var xname=null;
    if(zytype == "0"){
        xname="小时";
    }else if(zytype == "1"){
        xname="日期";
    }
    var xvalue=[];
    var syvalue=[];
    var nyvalue=[];
    var scount=0;
    var ncount=0;
    $.get( "../../rll/rllhourcount/kllChartbytime?type="+zytype+"&time="+zytime,function(r){
        var time=r.time;
        var skll=r.skll;
        var nkll=r.nkll;
        var timeArray=[];
        /*var skllArray=[];
        var nkllArray=[];*/
        var skllCount=0;
        var nkllCount=0;

        /*//处理时间
        for (var i = 0; i <time.length ; i++) {
            var t1=time[i].split(" ");
            var t2=t1[1].split(":");
            if(Number(t2[0])+1==24){
                time[i]="0:00"
            }else {
                time[i]=(Number(t2[0])+1)+":00"
            }
            skllCount+=skll[i];
            nkllCount+=nkll[i];
        }*/

        /*$("#skllCount").html("南区:"+skllCount+"人次");
        $("#nkllCount").html("北区:"+nkllCount+"人次");*/
        var myChart = echarts.init(document.getElementById('peopleflow'));
        var option = {
            tooltip : {
                trigger: 'axis',
                formatter: function(params) { //自定义函数修改折线图给数据加单位
                    var str = '';//声明一个变量用来存储数据
                    str += '<div>'+ params[0].name +'</div>'; //显示首行的函数
                    for(var i=0; i<params.length; i++) { //图显示的数据较多时需要循环数据，这样才可以成功的给多条数据添加单位
                        str += '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:'+params[i].color+';"></span>'+ params[i].seriesName +'</span> : <span>'+ params[i].data+'人次' +'</br>';
                    }
                    return str;
                }
            },
            grid: {
                x: 46,
                y:30,
                x2:32,
                y2:30,
                borderWidth: 0
            },
            legend: {
                data:['南区','北区'],
                textStyle:{
                    color:"#e9ebee"
                },
            },
            calculable : true,
            xAxis : [
                {
                    type : 'category',
                    name:xname,
                    boundaryGap : false,
                    data : time,
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#a4a7ab'
                        }
                    }
                }
            ],
            yAxis : [
                {
                    type : 'value',
                    name:'总数/人次',
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#a4a7ab'
                        }
                    }

                }
            ],
            series : [
                {
                    name:'南区',
                    type:'line',
                    //stack: '人次',
                    data:skll,
                    smooth: true,
                    itemStyle: {
                        normal: {
                            color:"#e15828"
                        }
                    }
                },
                {
                    name:'北区',
                    type:'line',
                   // stack: '人次',
                    smooth: true,
                    data:nkll,
                    itemStyle: {
                        normal: {
                            color:"#2e7cff"
                        }
                    }
                }
            ]
        };
        myChart.setOption(option);
        window.addEventListener("resize",function(){
            myChart.resize();
        });
    })
}
//客流车流销售额对比
function contrastChart() {
    var xname=null;
    if(zytype == "0"){
        xname="小时";
    }else if(zytype == "1"){
        xname="日期";
    }
    var timeArray=[];
    var salelist=[];
    var clllist;
    var rlllist;
    $.get( "../../jxc/jxcsaleorder/salecllrll?type="+zytype+"&time="+zytime,function(r){
        var maps=r.salecllrlllist;
        timeArray=maps["销售额"][0];
       // salelist=maps["销售额"][1];
        for (let i = 0; i <maps["销售额"][1].length ; i++) {
            salelist.push(maps["销售额"][1][i].toFixed(2));
        }
        clllist=maps["车流量"];
        rlllist=maps["客流量"];
        var myChart = echarts.init($("#contrastChart")[0]);
        var option = {
            tooltip : {
                trigger: 'axis',
                formatter: function(params) { //自定义函数修改折线图给数据加单位
                    var str = '';//声明一个变量用来存储数据
                    str += '<div>'+ params[0].name +'</div>'; //显示首行的函数
                    str += '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:'+params[0].color+';"></span>'+ params[0].seriesName +'</span> : <span>'+ params[0].data+'元' +'</br>';
                    str += '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:'+params[1].color+';"></span>'+ params[1].seriesName +'</span> : <span>'+ params[1].data+'车次' +'</br>';
                    str += '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:'+params[2].color+';"></span>'+ params[2].seriesName +'</span> : <span>'+ params[2].data+'人次' +'</br>';
                    return str;
                }
            },
            grid: {
                x: 46,
                y:30,
                x2:32,
                y2:40,
                borderWidth: 0
            },
            calculable : true,
            legend: {
                x: 'center',
                data: ["销售金额","车流量","客流量"],
                textStyle:{
                    color:"#e9ebee"
                }
            },
            xAxis : [
                {
                    type : 'category',
                    name:xname,
                    boundaryGap : false,
                    data :timeArray,
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#a4a7ab'
                        }
                    }
                }
            ],
            yAxis : [
                {
                    type: 'value',
                    name: '销售金额/元',
                    splitLine: {
                        show: false
                    },
                    interval: 50,
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#a4a7ab'
                        },
                    }
                },
                {
                    type: 'value',
                    name: '流量/次',
                    splitLine: {
                        show:false
                    },
                    interval: 5,
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#a4a7ab'
                        },
                    }
                }
            ],
            series : [
                {
                    name:'销售金额',
                    type:'line',
                    data:salelist,
                    smooth: true,
                    itemStyle: {
                        normal: {
                            color:"#e15828"
                        }
                    }
                },
                {
                    name:'车流量',
                    type:'line',
                    yAxisIndex: 1,
                    data: clllist,
                    smooth: true,
                    itemStyle: {
                        normal: {
                            color:"#2e7cff"
                        }
                    }
                },
                {
                    name:'客流量',
                    type:'line',
                    yAxisIndex: 1,
                    data:rlllist,
                    smooth: true,
                    itemStyle: {
                        normal: {
                            color:"#e9a832"
                        }
                    }
                }
            ]
        };
        myChart.setOption(option);
        window.addEventListener("resize",function(){
            myChart.resize();
        });
    })
}
/****************第2标签方法结束*************************/






